<template class="product">
        <div >
            <div class="Product_Image">
            <img :src="Product.coverimageUrl" style="width: 100%;height: 100%; background: no-repeat 50%" />
        </div>
        </div>
</template>

<script>


export default{
    name: "ProductCard",
    props: {
        Product: Object
    },
    data() {
        return {
        // Title:'',
        // Detail:'',
        // Url:''
        };
    },
    created() {
        ;
    },
    methods:{
        showdetail(){
            
            this.$emit('showdetail',this.Product)
            // this.$refs.publistContent.visible=true
        }
    }
}
</script>

<style lang="less" scoped>
   .product{
    width: 100%px;
    background-color: #FBE5D6;
   }
        // height: 300px;
        .Product_Image{
        margin-top: 10px;
        width: 200px;
        height: 200px;
        min-height: 100%;
        
        // background: #f0f2f5 url(~@/assets/company.jpg) no-repeat 50%;
        background-size: 100%;
        }
        .Product_Content{
            margin-left: 10px;
            margin-top: 10px;
            width: 50%;
            height: 80px;
            .Title{
                font-size: large;
                margin-bottom: 10px;
            }
            
        }
    
</style>